/* eslint-disable no-unused-vars */
import React, { Component } from "react";
import "./xhfFacilitySuccess.scss";
import { setUserType } from "../../../Redux/Action/credit/AuthenticationA";
import { getAppPlatformsDatas } from "../../../Redux/Action/nativeDatas/nativeDatas";
import { connect } from "react-redux";
import { Toast } from "antd-mobile";
import SendMSGCode from "../../../component/sendMSGCode/sendMSGCode";
import { InterfaceG, agreements_url } from "../../../config/Config";
import Button from "../../../component/button/index";
import XFButton from "../../../xfCompontent/xfButton/xfButton";
import MainLayout from "../../../component/mainLayout/mainLayout";
import yhTools from "../../../tools/yh";
import { getCachingKeys, dropByCacheKey } from "react-router-cache-route";
class xhfFacilitySuccess extends Component {
	constructor(props) {
		super(props);
		this.state = {
			showMsgBox: false,
			creditAmt: "",
			billDay: "",
			rtnDay: "",
			cardDataList: [],
			phone: "",
			orderNo: "",
			bindCardFlag: ""
		};
	}

	componentDidMount() {
		this.getCreditSuccess();
	}

	componentWillUnmount() {}
	gotoXyPage(type) {
		if (type == "1") {
			this.props._setUserType({ personalContract: "1" }); //循环额度额度合同页面签署合同标记：0-签署（返回首页），1-不签署（返回计算额度）
			// window.location.replace("#/personalCreditAmountContract");//打开个人循环额度合同
			this.props.history.push({
				pathname: "/iframeAgreements",
				state: {
					src: agreements_url + "/xhfCreditPaymentContract.html",
					title: "个人循环授信借款合同"
				}
			});
		} else if (type == "2") {
			//打开支付协议页面
			this.props.history.push("/agreementoflianyintong");
		} else if (type == "3") {
			this.props.history.push("/paymentDiscount/coupon");
		} else if (type == "5") {
			const year = new Date().getFullYear();
			const month = new Date().getMonth() + 1;
			const day = new Date().getDate();
			const commonParams = {
				year,
				month,
				day
			};
			this.props.history.push({
				pathname: "/nonStudentCommitmentLetter",
				params: commonParams
			});
		}
	}
	goActiveFlow() {
		// 点击激活按钮
		let objs = {
			url: InterfaceG.xhfActiveFlow,
			params: {
				source: this.props.getAppPlatformsDatas.isFromPayMoney ? "0" : "2" //0:收银台
			}
		};
		let _that = this;
		Toast.loading("加载中...", 100);
		yhTools.request(objs).then(res => {
			if (res.code === "0") {
				Toast.hide();
				_that.sendCode.countdown();
				if (res.data.pageNo === "pop") {
					//短信弹框
					//弹框
					_that.setState({
						showMsgBox: true,
						phone: res.data.phone,
						orderNo: res.data.orderNo
					});
				} else if (res.data.pageNo === "password") {
					//设置密码
					Toast.info("为了您的使用安全，请先设置支付密码", 2, () => {
						_that.props.history.push({
							pathname: "/xhfSetPasswordPage",
							state: {
								gotoNext: "edjh"
							}
						});
					});
				} else if (res.data.pageNo === "activeSuccess") {
					//激活成功
					_that.props.history.push({
						pathname: "/xhfActiveSuccessPage"
					});
				} else if (res.data.pageNo === "closed") {
					// 收银台过来
					yhTools.closePage({ flag: "xhfFacilitySuccessPage" });
				}
			}
		});
	}
	//提交回调
	submitCode(code) {
		this.shxhfVSignKlnContract(code); // 提交短信 验证
	}
	//提交短信后签署合同
	shxhfVSignKlnContract(code) {
		let objs = {
			url: InterfaceG.shxhfVSignKlnContract,
			params: {
				source: this.props.getAppPlatformsDatas.isFromPayMoney ? "0" : "-1", // 收银台传0,其余任意
				verifyCode: code,
				orderNo: this.state.orderNo,
				deviceId: this.props.getAppPlatformsDatas.devicesInfo.deviceId
			},
			_alertShow: false
		};
		let _that = this;
		Toast.loading("加载中...", 100);
		yhTools.request(objs).then(res => {
			if (res.code === "0") {
				Toast.hide();
				const pageNo = res.data.pageNo;
				if (pageNo == "payBarCode") {
					_that.props.history.push({
						pathname: "/payCode",
						query: {
							from: "/xhfHomeCredit"
						}
					});
				} else if (pageNo === "password") {
					_that.props.history.push({
						pathname: "/xhfSetPasswordPage",
						state: {
							gotoNext: "edjh"
						}
					});
				} else if (pageNo === "closed") {
					// 收银台过来
					yhTools.closePage({ flag: "xhfFacilitySuccessPage" });
				}
			} else {
				Toast.info(res.message, 2);
			}
		});
	}

	closeSendModal() {
		// 关闭验证码弹框
		this.setState({
			showMsgBox: false
		});
	}

	sendYzm() {
		//重新发送验证码
		this.goActiveFlow();
	}
	getCreditSuccess() {
		// 获取额度和账单日
		const objs = {
			url: InterfaceG.getCreditSuccess,
			params: {
				version: "1.0"
			}
		};
		yhTools.request(objs).then(res => {
			if (res.code === "0") {
				this.setState({
					creditAmt: res.data.creditAmt, // 授信额度
					billDay: res.data.billDay, // 账单日
					rtnDay: res.data.rtnDay, //还款日
					bindCardFlag: res.data.bindCardFlag, // 是否绑卡
					cardDataList: res.data.list, //优惠券列表
					student: res.data.student //是否展示学生承诺函
				});
				// this.getMyCouponList();
			} else {
				Toast.info(res.message, 2);
			}
		});
	}
	render() {
		let _pageParams = {
			header: {
				title: "小辉付",
				sensorsData: {
					title: "开通成功页"
				},
				goBackAction: () => {
					// 收银台过来
					if (this.props.getAppPlatformsDatas.isFromPayMoney) {
						yhTools.closePage({ flag: "xhfFacilitySuccessPage" });
					} else {
						this.props.history.push({
							pathname: "/xhfHomeCredit"
						});
						getCachingKeys().forEach(value => {
							dropByCacheKey(value);
						});
					}
				}
			},
			history: this.props.history,
			cacheLifecycles: this.props.cacheLifecycles
		};

		const {
			cardDataList,
			bindCardFlag,
			creditAmt,
			billDay,
			rtnDay,
			student
		} = this.state;
		return (
			<MainLayout pageParams={_pageParams}>
				<div className="xhfFacilitySuccess">
					<div className="content">
						<p className="success-title">恭喜你获得小辉付额度</p>
						<p className="paris-title">
							<em>{creditAmt}</em>元
						</p>
						<p className="success-date">
							账单日为每月<em>{billDay}</em>日，最后还款日为每月
							<em>{rtnDay}</em>日
						</p>

						{
							<div>
								<div style={{ marginTop: ".36rem" }}>
									<XFButton
										handleBtn={this.goActiveFlow.bind(this)}
										btnStyle={{
											height: "1rem",
											width: "6.38rem",
											borderRadius: ".5rem",
											color: "#fff",
											lineHeight: "1rem"
										}}
										btText={"设置支付密码"}
									></XFButton>
								</div>
							</div>
						}
						<p className="coupun-title">
							您的权益已到账{" "}
							<em onClick={this.gotoXyPage.bind(this, "3")}>查看更多 >></em>
						</p>
						<div className="coupun-content">
							{cardDataList.map((item, key) => {
								return (
									<li className="coupun-item" key={key}>
										<img src={item.couponUrl} />
										<span className="coupun-item-title">{item.couponName}</span>
										<p className="coupun-item-Price">
											<em style={{ fontSize: "0.26rem" }}>¥</em>
											<em
												style={{ fontSize: "0.54rem", paddingRight: "0.14rem" }}
											>
												{item.couponAmount}
											</em>
											{item.couponUseCondition}
										</p>
										<p className="coupun-item-times">{item.couponTerm}</p>
									</li>
								);
							})}
						</div>
					</div>
				</div>
				<SendMSGCode
					sendSuccessPhone={this.state.phone}
					ref={ref => {
						this.sendCode = ref;
					}}
					getYZMCode={this.sendYzm.bind(this)}
					submitCode={this.submitCode.bind(this)}
					closeSendModal={this.closeSendModal.bind(this)}
					showMsgBox={this.state.showMsgBox}
				/>
			</MainLayout>
		);
	}
}

function mapStateToProps(state) {
	return state;
}

function mapDispatchToProps(dispatch) {
	return {
		_setUserType: options => {
			dispatch(setUserType(options));
		},
		_getAppPlatformsDatas: options => {
			//获取设备信息
			dispatch(getAppPlatformsDatas(options));
		}
	};
}

const xhfFacilitySuccessPage = connect(
	mapStateToProps,
	mapDispatchToProps
)(xhfFacilitySuccess);
export default xhfFacilitySuccessPage;
